<template>
	<view>
		<goodsclass></goodsclass>
	<view>
		<navigator url="../address/addprodce" hover-class="navigator-hover">
			<text class="gonggao">系列--->更多</text>
		</navigator>
		<view class="cate-list">
				
				<view class="cate-item" v-for="(item,i) in seriesList" :key="i" @click="girunl(i)">
					<image :src="item.seriesimage" class="image_left" />
					<text>{{item.seriesname}}</text>
				</view>
			</view>
		</view>
	<view>
		<navigator url="../address/addprodce" hover-class="navigator-hover">
			<text class="gonggao">样品--->更多</text>
		</navigator>
		<view class="cate-list">
				
				<view class="cate-item" v-for="(item,i) in typeList" :key="i" @click="girunl(i)">
					<image :src="item.goodurl" class="image_left" />
					<text>{{item.googname}}</text>
				</view>
			</view>
		</view>
	</view>
		
	</view>
</template>

<script>
	import goodsclass from "@/components/goodsclass/goodclass.vue";
	export default {
		components: {
			goodsclass,
		},
		data() {
			return {
				seriesList:[],
				typeList: [],
			}

		},
		methods: {
			girunl(index) {
				uni.navigateTo({
					url: "/pages/download/download?id=" + index
				})
			},
			gettypeList(){
				this.tabCurrentIndex = 0;
				uni.request({
					url: this.api.commodity,
					method: "GET",
				}).then(data => {
					let [err, res] = data
					this.typeList = res.data
					console.log(res.data)
				})
			},
			getseriesData() {
				uni.request({
					url: this.api.Getseries,
					method: "GET",
				}).then(data => {
					let [err, res] = data
					this.seriesList = res.data
					console.log(res.data)
				})
			},
		},
		onLoad() {
			// this.swipers = ['../../static/tabbar/lunbotu-01.jpg',
			// 	"../../static/tabbar/lunbotu-02.jpg",
			// 	"../../static/tabbar/lunbotu-03.jpg",
			// 	"../../static/tabbar/lunbotu-04.jpg",
			// ];
			this.gettypeList()
			this.getseriesData()
		}
	}
</script>

<style>
	.demo-uni-row {
		margin-bottom: 10px;

		// 组件在小程序端display为inline
		// QQ、字节小程序文档写有 :host，但实测不生效
		// 百度小程序没有 :host
		/* #ifdef MP-TOUTIAO || MP-QQ || MP-BAIDU */
		display: block;
		/* #endif */
	}

	.prcoudet {
		width: 100%;
		white-space: 20%;

		/* border: solid 1px; */
		/* display: flex; */
		word-break: break-all;
	}

	.image_left {
		margin-left: 15px;
		margin-top: 20px;
		border: solid 1px;
		width: 150px;
		height: 150px;
		float: left;
		border-radius: 50%;
		word-break: break-all;
	}

	.text_name {
		display: flex;
		margin-top: 150px;
	}

	.cate-list {
		display: flex;
		flex-wrap: wrap;
	}

	.cate-item {
		/* 	width: 33.3%;
  */
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;

		image {
			margin: 10px;
			width: 450px;
			height: 450px;
			border-radius: 50%;
		}
	}
</style>
